<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<title>General</title>
<!-- for-mobile-apps -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //for-mobile-apps -->
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/medile.css" rel='stylesheet' type='text/css' />
<link href="css/single.css" rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="css/contactstyle.css" type="text/css" media="all" />
<link rel="stylesheet" href="css/faqstyle.css" type="text/css" media="all" />
<!-- font-awesome icons -->
<link rel="stylesheet" href="css/font-awesome.min.css" />
<!-- //font-awesome icons -->
<!-- news-css -->
<link rel="stylesheet" href="news-css/news.css" type="text/css" media="all" />
<!-- //news-css -->
<!-- list-css -->
<link rel="stylesheet" href="list-css/list.css" type="text/css" media="all" />
<!-- //list-css -->
<!-- js -->
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<!-- //js -->
<!---<link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700italic,700,400italic,300italic,300' rel='stylesheet' type='text/css'>--->
<!-- start-smoth-scrolling -->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){		
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
<style>
/* 单行文本溢出 */
.single_line_ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 130px;
}
</style>
<!-- start-smoth-scrolling -->
<link href="css/owl.carousel.css" rel="stylesheet" type="text/css" media="all">
<script src="js/owl.carousel.js"></script>
<script>
	$(document).ready(function() { 
		$("#owl-demo").owlCarousel({
	 
		  autoPlay: 3000, //Set AutoPlay to 3 seconds
	 
		  items : 5,
		  itemsDesktop : [640,5],
		  itemsDesktopSmall : [414,4]
	 
		});
	 
	}); 
</script> 
</head>
	
<body>
<!-- header -->

<!-- //header -->
<!-- bootstrap-pop-up -->
	
	<script>
		$('.toggle').click(function(){
		  // Switches the Icon
		  $(this).children('i').toggleClass('fa-pencil');
		  // Switches the forms  
		  $('.form').animate({
			height: "toggle",
			'padding-top': 'toggle',
			'padding-bottom': 'toggle',
			opacity: "toggle"
		  }, "slow");
		});
	</script>
<!-- //bootstrap-pop-up -->
<!-- nav -->
	
<!-- //nav -->

<!-- /w3l-medile-movies-grids -->

		<div class="w3l-medile-movies-grids">

				<!-- /movie-browse-agile -->
				
				      <div class="movie-browse-agile">
					     <!--/browse-agile-w3ls -->
						<div class="browse-agile-w3ls general-w3ls">
								<div class="tittle-head">
									<h4 class="latest-text">搜索结果 </h4>
									<div class="container">
										<div class="agileits-single-top">
											<ol class="breadcrumb">
											  <li><a href="">首页</a></li>
											  <li class="active">所有</li>
											</ol>
										</div>
									</div>
								</div>
								     <div class="container">
							<div class="browse-inner" id="resulthead">
								<!-- /latest-movies1 -->
							    
							<!-- //latest-movies1 -->


								
						

								</div>
						</div>
				<!--//browse-agile-w3ls -->
						<div class="blog-pagenat-wthree" >
							<ul id="blog-pagenats">
								<li><a class="frist" href="#">Prev</a></li>
								<li><a href="#">1</a></li>
								<li><a href="#">2</a></li>
								<li><a href="#">3</a></li>
								<li><a href="#">4</a></li>
								<li><a href="#">5</a></li>
								<li><a class="last" href="#">Next</a></li>
							</ul>
						</div>
					</div>
				    <!-- //movie-browse-agile -->
				   <!--body wrapper start-->
				<!--body wrapper start-->
					<div class="review-slider">
						 <h4 class="latest-text">精选电影</h4>
						       <div class="container">

						       		 	<div class="swiper-container w3_agile_banner_bottom_grid ">
							  					<div class="swiper-wrapper">
							  					
							  					
						       					</div>
						       			</div>
						       
						       
						       
						       
						       
						 		<!-- <div class="w3_agile_banner_bottom_grid" style="height:360px;">style="opacity: 1; background-color:red; display: block; height:330.38px;"
										<div id="owl-demo" class="owl-carousel owl-theme">
									
												 <div class="item">
													<div class="w3l-movie-gride-agile w3l-movie-gride-agile1">
														<a href="single.html" class="hvr-shutter-out-horizontal"><img src="images/m13.jpg" title="album-name" class="img-responsive" alt=" " />
															<div class="w3l-action-icon"><i class="fa fa-play-circle" aria-hidden="true"></i></div>
														</a>
														<div class="mid-1 agileits_w3layouts_mid_1_home">
															<div class="w3l-movie-text">
																<h6><a href="single.html">Citizen Soldier</a></h6>							
															</div>
															<div class="mid-2 agile_mid_2_home">
																<p>2016</p>
																<div class="block-stars">
																	<ul class="w3l-ratings">
																		<li>评分</li>
																	
																	</ul>
																</div>
																<div class="clearfix"></div>
															</div>
														</div>
														
													</div>
												</div>  
						
										  </div>
										</div> -->
										
										
								 </div>

						<!--body wrapper end-->
							</div>	
		</div>
	<!-- //w3l-medile-movies-grids -->
	
	<!-- //comedy-w3l-agileits -->
<!-- footer -->
	
<!-- //footer -->
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
    $(".dropdown").hover(            
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideDown("fast");
            $(this).toggleClass('open');        
        },
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideUp("fast");
            $(this).toggleClass('open');       
        }
    );
});
</script>
<!-- //Bootstrap Core JavaScript -->
<!-- here stars scrolling icon -->
	<script type="text/javascript">

		$(document).ready(function() {	
			$().UItoTop({ easingType: 'easeOutQuart' });
			 $.ajax({
			     
		         type: "POST",//方法类型
		         dataType: "json",//预期服务器返回的数据类型
		         url: "${pageContext.request.contextPath}/AdminServlet" ,//url
		         data:{op:"findbyname",pageNum:1,pageSize:12},
		         success: function (result,status,xhr) {
		        	 var val=eval(result);
		        	 var movie=val.movies;
		        	 
		        	 show(movie);
		         } ,
		         error : function() {
		             alert("错误！");
		         }
		     });
			 
				$(document).on("click",".page",function(){
					var i=$(this).text();
					
					 $.ajax({
					     
				         type: "POST",//方法类型
				         dataType: "json",//预期服务器返回的数据类型
				         url: "${pageContext.request.contextPath}/AdminServlet" ,//url
				         data:{op:"findbyname",pageNum:i,pageSize:12},
				         success: function (result,status,xhr) {
				        	 var val=eval(result);
				        	 var movie=val.movies;
				        	 show(movie);
				        	 
				         } ,
				         error : function() {
				             alert("错误！");
				         }
				     });
				});
				$(document).on("click","#pre",function(){
					var i=$("#pageNum").text();
					if(i==1){
						i=1;
					}if(i>1){
						i=i-1;
					}
					 $.ajax({
					     
				         type: "POST",//方法类型
				         dataType: "json",//预期服务器返回的数据类型
				         url: "${pageContext.request.contextPath}/AdminServlet" ,//url
				         data:{op:"findbyname",pageNum:i,pageSize:12},
				         success: function (result,status,xhr) {
				        	 var val=eval(result);
				        	 var movie=val.movies;
				        	 show(movie);
				        	 
				         } ,
				         error : function() {
				             alert("错误！");
				         }
				     });
				});
				$(document).on("click",".movie",function(){
					var i=$(this).attr("data-id");

					
					 $.ajax({
					     
				         type: "POST",//方法类型
				         dataType: "json",//预期服务器返回的数据类型
				         url: "${pageContext.request.contextPath}/AdminServlet" ,//url
				         data:{op:"addCount",id:i},
				         success: function (result,status,xhr) {

				         } ,
				         error : function() {
				             alert("错误！");
				         }
				     });
				});
				
				
				$(document).on("click","#next",function(){
					var i=$("#pageNum").text();
					
					if(parseInt(i)<$("#total").text()){
						i=parseInt(i)+1;
					}if(i==$("#total").text()){
						i=$("#total").text();
					}
					
					 $.ajax({
					     
				         type: "POST",//方法类型
				         dataType: "json",//预期服务器返回的数据类型
				         url: "${pageContext.request.contextPath}/AdminServlet" ,//url
				         data:{op:"findbyname",pageNum:i,pageSize:12},
				         success: function (result,status,xhr) {
				        	 var val=eval(result);
				        	 var movie=val.movies;
				        	 
				        	 show(movie);
				         } ,
				         error : function() {
				             alert("错误！");
				         }
				     });
				});			
				
				//底部精选电影排序(先评分后点击量)：
				
				 $.ajax({//ajax
						 async:true,
						 type:"get",
					     dataType:"json", 
						 url:"${pageContext.request.contextPath}/MoviesSearch",
						 data:{
							 op:"searchMoviesByQualityChoice",
							 score:"yes",
							 clickCount:"yes"
						 },
						 
						 success:function(result,status,xhr){
							 result=result.slice(0,6);
								console.log("总精选电影:"+result)
								
								 selectTheMovies(result);
		 					
						 
						 },
						 error:function(error,status){
							 console.log(status);
							console.log(error)
						 }
						
					});  

});
		function selectTheMovies(result){	
			 $(".swiper-wrapper").empty();	
				$.each(result,function(index,movies){
					
					$(".swiper-wrapper").append("<div class=\"swiper-slide w3l-movie-gride-agile\">"+
					  		"<a href=\"single.jsp?id="+movies.movieId+"\" class=\"hvr-shutter-out-horizontal\"><img  style=\"height:268px; width:182px;\"  src=\""+movies.moviePicture+"\" title=\"album-name4\" class=\"img-responsive\" alt=\" \" />"+
								"<div class=\"w3l-action-icon\"><i class=\"fa fa-play-circle\" aria-hidden=\"true\"></i></div>"+
							"</a>"+
							"<div class=\"mid-1 agileits_w3layouts_mid_1_home\">"+
									"<div class=\"w3l-movie-text\">"+
										"<h6><a href=\"single.jsp?id=\""+movies.movieId+"\" class=\"single_line_ellipsis\" >"+movies.movieName+"</a></h6>"+							
									"</div>"+
									"<div class=\"mid-2 agile_mid_2_home\">"+
										"<p style=\" float: unset;line-height: 15px;\">"+movies.moviePublishDate+"</p>"+
										"<div class=\"block-stars\">"+
											"<ul class=\"w3l-ratings\">"+
												"<li style=\"position: absolute;left: 70px;\">评分:"+movies.movieRating+"</li>"+
											"</ul>"+
										"</div>"+
										"<div class=\"clearfix\"></div>"+
									"</div>"+
							"</div>"+
					"</div>");	
					
				})
		}
		function show(result){
			// 清空表格原始数据
			$("#blog-pagenats").empty();
			// 渲染表格中的数据
			
				// 渲染表格数据
				showData(result.data);
				$("#blog-pagenats").append("<div style=\"visibility:hidden\"><span id=\"total\">"+result.pages+"</span><span id=\"pageNum\" >"+result.pageNum+"</span></div>");
				$("#blog-pagenats").append("<li><a class=\"frist\" id=\"pre\" href=\"#\">上一页</a></li>");

				
				for(var i = 1; i <= result.pages; i++){
					if(i==result.pageNum){
						$("#blog-pagenats").append("<li><a style=\"background-color: #27a9e3\" class=\"page\" href=\"#\">"+i+"</a></li>");
					}else{
						$("#blog-pagenats").append("<li><a class=\"page\" href=\"#\">"+i+"</a></li>");
					}
				}
				$("#blog-pagenats").append("<li><a class=\"last\" id=\"next\" href=\"#\">下一页</a></li>");
				}		
		
		function showData(result){
			// 清空表格原始数据
			$("#resulthead").empty();
			// 渲染表格中的数据
			$.each(result,function(index,movies){
				$("#resulthead").append("<div class=\"col-md-2 w3l-movie-gride-agile\">"
						 +"<a class=\"movie\" data-id=\""+movies.movieId+"\" href=\"single.jsp?id="+movies.movieId+"\" class=\"hvr-shutter-out-horizontal\"><img style=\"width:182px;height:268px\" src=\""+movies.moviePicture+"\" title=\"album-name\" alt=\" \" />"
						  +"<div class=\"w3l-action-icon\"><i class=\"fa fa-play-circle\" aria-hidden=\"true\"></i></div>"
						+"</a>"
						  +"<div class=\"mid-1\">"
							+"<div class=\"w3l-movie-text\">"
								+"<h6><a href=\"single.jpg?id=\""+movies.movieId+"\" class=\"single_line_ellipsis\" >"+movies.movieName+"</a></h6>"							
							+"</div>"
							+"<div class=\"mid-2\">"
				                    +"<p>"+movies.moviePublishDate+"</p>"
								+"<div class=\"block-stars\">"
									+"<ul class=\"w3l-ratings\">"
										     +"<li>评分"+movies.movieRating+"</li>"
                                  +"</ul>"
								+"</div>"
								+"<div class=\"clearfix\"></div>"
							+"</div>"
								
						+"</div>"
						+"</div>");
			});
		}
	</script>
			<link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.css">  
		<link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.min.css">  
		<script src="https://unpkg.com/swiper/js/swiper.js"> </script>
		<script src="https://unpkg.com/swiper/js/swiper.min.js"> </script>
		<script>
			
			var appendNumber = 4;
			var prependNumber = 1;
			var swiper = new Swiper('.swiper-container', {
				  loop: true,
				  slidesPerView: 6,
				  centeredSlides: false,
				  spaceBetween: 0,
				  loopedSlides:6,
			  autoplay: {
			      delay: 2500,
			      disableOnInteraction: false,
			   },
			  pagination: {
			    el: '.swiper-pagination',
			    clickable: true,
			  },
			  navigation: {
			    nextEl: '.swiper-button-next',
			    prevEl: '.swiper-button-prev',
			  },
			});
			</script>
<!-- //here ends scrolling icon -->
</body>
</html>